<!-- 饼状图和柱状图-->
<template>
    <div class="course3">
        <!-- 饼状图（左） -->
        <div class="course-pie-chart">
            <PieChart :studentStage="studentStage"/>
        </div>
        <!-- 柱状图（右） -->
        <div class="course-histogram">
            <Histogram :histogram="histogram"/>
        </div>
    </div>
</template>

<script>
import PieChart from './pieChart.vue'
import Histogram from './histogram.vue'
export default {
    props:['studentStage','histogram'],
    components:{
        PieChart,
        Histogram
    }
}
</script>

<style lang="less" scoped>
.course3{
    width: 100%;
    display: flex;
    flex-wrap:wrap;
    margin-bottom: 15px;
    .course-pie-chart{
        flex: 1;
        height: 280px;
        margin-right: 15px;
    }
    .course-histogram{           
        flex: 2;
        height: 280px;
    }
}
</style>